<!-- <div nz-row nzGutter="16">
    <div nz-col nzSpan="4">
        <button nz-button nzType="primary" (click)="showMatModal()" *ngIf="bornRoles.add">新增</button>
        <button nz-button nzType="primary" (click)="delete()" class="margin-left-16" *ngIf="bornRoles.del">删除</button>
    </div>
    <div nz-col nzSpan="10">
    </div>
    <div nz-col nzSpan="2">
        <label class="line-height-32-prefix">物料编码：</label>
    </div>
    <div nz-col nzSpan="3">
        <input appHotSearch (hotSearchEmit)="getSearchData()" type="text" [(ngModel)]="materialCode" nz-input placeholder="输入物料编码"/>
    </div>
    <div nz-col nzSpan="2">
        <label class="line-height-32-prefix">物料名称：</label>
    </div>
    <div nz-col nzSpan="3">
        <input appHotSearch (hotSearchEmit)="getSearchData()" type="text" [(ngModel)]="materialName" nz-input placeholder="输入物料名称"/>
    </div>
</div> -->
<!-- <div nz-row class="margin-top-16">
    <button nz-button nzType="primary" (click)="showModal()" *ngIf="bornRoles.add">新增</button>
    <button nz-button nzType="primary" (click)="delete()" class="margin-left-16" *ngIf="bornRoles.del">删除</button>
</div> -->
<div nz-row class="margin-top-16">
    <div nz-col nzSpan="4">
        <nz-tree [nzData]="nodes" nzBlockNode (nzClick)=nzEvent($event)></nz-tree>
    </div>
    <div nz-col nzSpan="20">
        <div nz-row>
            <div nz-col nzSpan="6">
                <button nz-button nzType="primary" (click)="showMatModal()" *ngIf="bornRoles.add">新增</button>
                <button nz-button nzType="primary" (click)="delete()" class="margin-left-16" *ngIf="bornRoles.del">删除</button>
            </div>
            <div nz-col nzSpan="3">
            </div>
            <div nz-col nzSpan="3">
                <label class="line-height-32-prefix">物料编码：</label>
            </div>
            <div nz-col nzSpan="4">
                <input appHotSearch (hotSearchEmit)="getSearchData()" type="text" [(ngModel)]="materialCode" nz-input placeholder="输入物料编码"/>
            </div>
            <div nz-col nzSpan="3">
                <label class="line-height-32-prefix">物料名称：</label>
            </div>
            <div nz-col nzSpan="4">
                <input appHotSearch (hotSearchEmit)="getSearchData()" type="text" [(ngModel)]="materialName" nz-input placeholder="输入物料名称"/>
            </div>
        </div>
       
        <div nz-row style="margin-top: 10px;">
            <nz-table #basicTable nzBordered [nzData]="listOfData" nzSize="small"  [nzFrontPagination]="false" [nzBordered]="true" nzTitle="物料列表">
                <thead>
                <tr>
                    <th nzShowCheckbox [(nzChecked)]="isAllChecked" (nzCheckedChange)="checkAll($event)"></th>
                    <th>物料编码</th>
                    <th>物料名称</th>
                    <th>单位</th>
                    <th>现有量</th>
                    <!-- <th>Action</th> -->
                </tr>
                </thead>
                <tbody>
                <tr *ngFor="let data of basicTable.data" class="editable-row">
                    <td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="checkSingle()"></td>
                    <td>
                        <span>{{ data.materialCode }}</span>
                    </td>
                    <td>{{ data.materialName }}</td>
                    <td>{{ data.materialUnit }}</td>
                    <td>{{ data.amount }}</td>
                    <!-- <td>
                    <a>Action 一 {{ data.name }}</a>
                    <nz-divider nzType="vertical"></nz-divider>
                    <a>Delete</a>
                    </td> -->
                </tr>
                </tbody>
            </nz-table>
        </div>
        <div nz-row class="margin-top-16">
            <nz-pagination class="float-right" [nzPageIndex]="pageIndex" (nzPageIndexChange)="clickPage($event)" [nzTotal]="totalSize" [nzPageSize]="pageSize" [nzShowTotal]="totalTemplate"></nz-pagination>
            <ng-template #totalTemplate let-total> 总共 {{ totalSize }} 条 </ng-template>
        </div>
    </div>
</div> 

<input type="hidden" [(ngModel)]="hidWarehouseId"/>
<input type="hidden" [(ngModel)]="hidWhsAreaId"/>
<input type="hidden" [(ngModel)]="hidMatetialId"/>   
<nz-modal appDragModal [nzStyle]="{left:'28%',top:'35%'}" [nzGetContainer]="modalDomBox" nzTitle="新增物料" [(nzVisible)]="isVisible" [nzOkLoading]="isOkLoading" 
(nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" nzWidth="45%">
    <form nz-form [formGroup]="validateForm">
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>库区</nz-form-label>
                    <nz-form-control [nzSpan]="16" nzErrorTip="请正确选择库区">
                        <!-- <input nz-input formControlName="whsArea"  placeholder="请选择库区" /> -->
                        <nz-tree-select [nzDropdownStyle]="{ 'max-height': '300px',left : '-200px' }" nzAllowClear="false" formControlName="whsArea" [nzNodes]="selWhsTree" nzPlaceHolder="请点击选择库区" (ngModelChange)="whsAreaChange($event)" class="width-10000"></nz-tree-select>
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>物料</nz-form-label>
                    <nz-form-control [nzSpan]="12" nzErrorTip="请选择物料">
                        <input readonly nz-input formControlName="material" (click)="showMatModal()" placeholder="请选择物料" />
                    </nz-form-control>
                    <button nz-button class="line-height-32-prefix" style="margin-top: 4px;" nzType="primary" (click)="showMatModal()">...</button>
                </nz-form-item>
            </div>
        </div>
        <!-- <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>现有量</nz-form-label>
                    <nz-form-control [nzSpan]="16" nzErrorTip="请输入现有量">
                        <nz-input-number formControlName="quantity" nzPlaceHolder="请输入现有量" class="width-10000"></nz-input-number>
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>采购周期</nz-form-label>
                    <nz-form-control [nzSpan]="16" nzErrorTip="请输入采购周期">
                        <input nz-input formControlName="buyCycle" placeholder="请输入采购周期" />
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>最高存储量</nz-form-label>
                    <nz-form-control [nzSpan]="16" nzErrorTip="请输入最高存储量">
                        <input nz-input formControlName="maxQuty" placeholder="请输入最高存储量" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="8" nzRequired>安全存储量</nz-form-label>
                    <nz-form-control [nzSpan]="16" nzErrorTip="请输入安全存储量">
                        <input nz-input formControlName="normalQuty" placeholder="请输入安全存储量" />
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div> -->
    </form>
</nz-modal>
<nz-modal appDragModal [nzStyle]="{left:'28%',top:'18%'}" [nzGetContainer]="modalDomBox" nzTitle="新增物料" [(nzVisible)]="isMatVisible" [nzOkLoading]="isMatOkLoading" 
(nzOnCancel)="matHandleCancel()" (nzOnOk)="matHandleOk()" nzWidth="55%">
    <div nz-row>
        <div nz-col nzSpan="4" >
            <label class="line-height-32-prefix">物料编码：</label>
        </div>
        <div nz-col nzSpan="6">
            <input type="text" [(ngModel)]="txtAltMatCode" nz-input placeholder="输入物料编码"/>
        </div>
        <div nz-col nzSpan="4">
            <label class="line-height-32-prefix">物料名称：</label>
        </div>
        <div nz-col nzSpan="6">
            <input type="text" [(ngModel)]="txtAltMatName" nz-input placeholder="输入物料名称"/>
        </div>
        <div nz-col nzSpan="4">
            <button nz-button nzType="primary" class="margin-left-16" (click)="getAltMatSearchData()">查询</button>
        </div>
    </div>
    <div nz-row class="margin-top-16">
        <nz-table #altBasicTable [nzData]="altMatListOfData" [nzFrontPagination]="false" [nzBordered]="true" nzSize="small">
            <thead>
            <tr>
                <th nzShowCheckbox [(nzChecked)]="altMatIsAllChecked" (nzCheckedChange)="altMatCheckAll($event)"></th>
                <th>物料编码</th>
                <th>物料名称</th>
                <!-- <th>规格</th>
                <th>数量</th> -->
                <th>单位</th>
                <th>单价</th>
                <!-- <th>Action</th> -->
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let data of altBasicTable.data">
                <td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="altMatCheckSingle()"></td>
                <td>
                    <input type="hidden" value="{{data.id}}" />
                    <span>{{ data.code }}</span>
                </td>
                <td>{{ data.name }}</td>
                <!-- <td>{{ data.spac }}</td>
                <td>--</td> -->
                <td>{{ data.unit }}</td>
                <td>{{ data.price }}</td>
                <!-- <td>
                <a>Action 一 {{ data.name }}</a>
                <nz-divider nzType="vertical"></nz-divider>
                <a>Delete</a>
                </td> -->
            </tr>
            </tbody>
        </nz-table>
    </div>
    <div nz-row class="margin-top-16">
        <nz-pagination class="float-right" [nzPageIndex]="altMatPageIndex" (nzPageIndexChange)="altMatClickPage($event)" [nzTotal]="altMatTotalSize" [nzPageSize]="altMatPageSize" [nzSize]="'small'" [nzShowTotal]="altMatTotalTemplate"></nz-pagination>
        <ng-template #altMatTotalTemplate let-total> 总共 {{ altMatTotalSize }} 条 </ng-template>
    </div>
</nz-modal>
